<template>
    <keep-alive>
        <component ref="component" :is="currentComponent" @handle="handle"></component>
    </keep-alive>
</template>

<script>
import pk from "../../components/pk";
import pkIndex from "../../components/pkIndex";
import pkRandom from "../../components/pkRandom";
import pkInvite from "../../components/pkInvite";
import pkResult from "../../components/pkResult";
import pkGuide from "../../components/pkGuide";

export default {
    components: {pk, pkIndex, pkRandom, pkInvite, pkResult, pkGuide},
    data() {
        return {
            components: ['pk', 'pkIndex', 'pkRandom', 'pkInvite', 'pkResult', 'pkGuide'],
            currentComponent: 'pkIndex',
            message: null,
        };
    },
    created() {
        // 是否微信
        if (! /mobile/i.test(navigator.userAgent.toLowerCase())) {
            this.currentComponent = 'pkGuide';
        }

        // 是否登录
        if (! this.userHelper.getInfo('user_cert')) {
            this.userHelper.login();
        }

        // 是否邀请
        if (this.commonHelper.query('room')) {
            this.currentComponent = 'pkInvite';
        }
    },
    mounted() {
        this.socket.onmessage = (message) => {
            this.$refs.component.onmessage(message);
        };
    },
    activated(e) {
        console.log('activated', e);
    },
    methods: {
        handle(event) {
            this.currentComponent = this.components.indexOf(event.name) === -1 ? 'pkIndex' : event.name;

            if (this.commonHelper.query('room') && event.name !== 'pkInvite') {
                this.$router.replace({path: 'index'});
            }
        }
    },
}
</script>
